import { View, Image, Text } from '@tarojs/components';
import Taro from '@tarojs/taro';
import React, { Component } from 'react';
import './index.less';
import actions from '../../actions/index';
import { connect } from 'react-redux';
import { store2Props } from '../../selectors';
import * as T from '../../types';
import 'taro-ui/dist/style/components/modal.scss';
import { IPLAND_OSS_HOST } from '../../../constant';
import { _ } from 'wmkit';


interface INaviProps {
  isOpened: boolean;
  onCancel: Function;
}
type IToolsBoxProps = T.IProps & INaviProps;

//@ts-ignore
@connect<Partial<IToolsBoxProps>, T.IToolsBoxState>(store2Props, actions)
export default class MoModal extends Component<Partial<IToolsBoxProps>, any> {
  constructor(props) {
    super(props);
    this.state = {
    };
  }

  render() {
    let {
      isOpened,
      main: { moouTitle, moouContent },
    } = this.props;
    return (
      isOpened ? <View className="ouContainer">
        <View className="ou">
          <View className="top">
            <View className="nameBg">
              <Text className='name'>{moouTitle || '欧皇卡'}</Text>
            </View>
          </View>
          <View className='desc'>
            效果：{moouContent}
          </View>
        </View>
        <Image
          className="close"
          src={`${IPLAND_OSS_HOST}home/moClose.png`}
          onClick={() =>
            this.props.onCancel()
          }>
        </Image>
      </View> : null
    );
  }
}

//create by moon https://github.com/creasy2010/moon
